/* 列表页面样式 */
.main-container {
  background-color: #EAEDF1;
}

.app-container {
  background-color: #FFFFFF;
  margin: 6px;
  padding:6px 6px 10px 6px;
}

.app-container .filter-container {
  margin-bottom: 5px;
  background-color: #F2F6FC;
  border-radius: 4px;
  padding: 5px;
}
.app-container .filter-container .filter-item{
  margin-bottom: 0 !important;
}
.app-container /deep/ .el-icon-circle-close {
    color: white;
}
.scroll-container {
  width: 100%;
  overflow: auto;
}

.scroll-content {
  min-width: 1000px;
}
.el-range-separator{
  min-width: 20px;
}

/*.app-container .filter-container button {*/
/*  height: 32px;*/
/*}*/
/*.app-container .filter-container .el-input{*/
/*  height: 32px;*/
/*}*/
/*.app-container .filter-container .el-select{*/
/*  height: 32px;*/
/*}*/
/*去除number加减三角*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.show {
  dispaly: block;
}

.hidden {
  display: none;
}

.justify {
  text-align: justify;
  text-align-last: justify;
}

.right {
  float: right;
}


.wrapClass {
  overflow-x: hidden;
  /*padding-right: 20px;*/
}

.btnEdit {
  text-align: center;
}

.btnSub {
  float: left;
  margin-left: 50px !important;
}

.btnExit {
  margin-right: 50px !important;
}

.el-dialog__body {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 20px 20px 0 20px;
}

.sort-div {
  font-size: 12px;
  height: 100%;
  line-height: initial;
}

.sort-div button {
  height: 50%;
  width: 100%;
  cursor: pointer;
  padding: 0 0;
  margin-left: 0px !important;
}

.form-scrollbar {
  height: 500px;
}

.pagination-container{
  padding: 0 !important;
  margin-top: 10px;
}

/* 全局table 滚动条的宽度*/
::-webkit-scrollbar {
  width: 6px;
  height: 8px;
}

/* 全局table 滚动条的滑块*/
::-webkit-scrollbar-thumb {
  background-color: #DDDEE0;
  border-radius: 3px;
}

/*vue+elementUi 用到type=‘number’ 默认样式清除*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type="number"] {
  -moz-appearance: textfield;
}

/* 表格上部 alert提示 */
.tipTitle {
  float: left;
  width: auto;
  margin-right: 5px;
  padding: 7px 0px;
}

/*微调待优化*/
/*@media (max-width: 1220px) {*/
/*  .filter-container div {*/
/*    margin: 3px;*/
/*  }*/
/*}*/
.el-tooltip__popper {
  max-width: 500px;
}

.el-table__body-wrapper {
  overflow-y: auto;
}
.el-form-item.is-error .el-input__inner, .el-form-item.is-error .el-textarea__inner, .el-message-box__input input.invalid {
  border-color: #F56C6C;
  animation: shake 0.5s 3, breath 2s infinite 1.2s;                         /* 动画名称 */
  animation-timing-function: ease-in-out;         /* 动画速度曲线：以低速开始和结束 */   /* 播放次数：无限 */
}

/*.el-form-item.is-error .el-input__inner:focus, .el-form-item.is-error .el-textarea__inner:focus, .el-message-box__input input.invalid:focus {*/
/*  border-color: #F56C6C;*/
/*  animation-name: none;                         !* 动画名称 *!*/
/*}*/
@keyframes breath {
  from { opacity: 0.5; border-color: #cc163a; }
  33%, to  { opacity: 0.7; border-color: #cc163a; box-shadow: none;}
  66%   { border-color: #cc163a; box-shadow: 0 0 0 .3rem #e16c9685;}
}

@keyframes shake { /* 水平抖动，核心代码 */
  10%, 90% { transform: translate3d(-1px, 0, 0); }
  20%, 80% { transform: translate3d(+2px, 0, 0); }
  30%, 70% { transform: translate3d(-4px, 0, 0); }
  40%, 60% { transform: translate3d(+4px, 0, 0); }
  50% { transform: translate3d(-4px, 0, 0); }
}

@keyframes flip-vertical-right {
  0% {
    transform: rotateY(0);
  }
  100% {
    transform: rotateY(180deg);
  }
}
/*
BUTTON CSS
 */
/**
   紫
 */
 .el-button--diypurple {
  color: #FFF;
  background-color: #f164da;
  border-color: #f164da;
}
.el-button--diypurple:focus, .el-button--diypurple:hover {
  background: #f381e1;
  border-color: #f381e1;
  color: #FFF;
}
.el-button--diypurple.is-plain {
  color: #f164da;
  background-color: #fce6f8;
  border-color: #f5bded;
}
.el-button--diypurple.is-plain:focus, .el-button--diypurple.is-plain:hover {
  background: #f164da;
  border-color: #f164da;
  color: #ffffff;
}
.el-button--diypurple.is-disabled, .el-button--diypurple.is-disabled:active, .el-button--diypurple.is-disabled:focus, .el-button--diypurple.is-disabled:hover {
  color: #FFF;
  background-color: #f79fe8;
  border-color: #f79fe8;
}


/**
   合欢色
 */
.el-button--diyhehuan {
  color: #FFF;
  background-color: #f0a1a8;
  border-color: #f0a1a8;
}
.el-button--diyhehuan:focus, .el-button--diyhehuan:hover {
  background: #f0a1a0;
  border-color: #f0a1a0;
  color: #FFF;
}
.el-button--diyhehuan.is-plain {
  color: #f5939b;
  background-color: #ffd9d9;
  border-color: #f0a1a0;
}
.el-button--diyhehuan.is-plain:focus, .el-button--diyhehuan.is-plain:hover {
  background: #f0a1a8;
  border-color: #f0a1a8;
  color: #ffffff;
}
.el-button--diyhehuan.is-disabled, .el-button--diyhehuan.is-disabled:active, .el-button--diyhehuan.is-disabled:focus, .el-button--diyhehuan.is-disabled:hover {
  color: #FFF;
  background-color: #fcc5c9;
  border-color: #fcc5c9;
}




/**
   豆蔻紫
 */
.el-button--diydoukouzi {
  color: #FFF;
  background-color: #ad6598;
  border-color: #ad6598;
}
.el-button--diydoukouzi:focus, .el-button--diydoukouzi:hover {
  background: #ad6590;
  border-color: #ad6590;
  color: #FFF;
}
.el-button--diydoukouzi.is-plain {
  color: #ad6598;
  background-color: #dfb1cc;
  border-color: #ad6598;
}
.el-button--diydoukouzi.is-plain:focus, .el-button--diydoukouzi.is-plain:hover {
  background: #ad6598;
  border-color: #ad6598;
  color: #ffffff;
}
.el-button--diydoukouzi.is-disabled, .el-button--diydoukouzi.is-disabled:active, .el-button--diydoukouzi.is-disabled:focus, .el-button--diydoukouzi.is-disabled:hover {
  color: #FFF;
  background-color: #af92a6;
  border-color: #af92a6;
}





/**
   向日葵色
 */
.el-button--diyxiangrikui {
  color: #FFF;
  background-color: #fecc11;
  border-color: #fecc11;
}
.el-button--diyxiangrikui:focus, .el-button--diyxiangrikui:hover {
  background: #fecc00;
  border-color: #fecc00;
  color: #FFF;
}
.el-button--diyxiangrikui.is-plain {
  color: #fecc11;
  background-color: #fdf7e3cb;
  border-color: #fecc11;
}
.el-button--diyxiangrikui.is-plain:focus, .el-button--diyxiangrikui.is-plain:hover {
  background: #fecc11;
  border-color: #fecc11;
  color: #ffffff;
}
.el-button--diyxiangrikui.is-disabled, .el-button--diyxiangrikui.is-disabled:active, .el-button--diyxiangrikui.is-disabled:focus, .el-button--diyxiangrikui.is-disabled:hover {
  color: #FFF;
  background-color: #fadf7e;
  border-color: #fadf7e;
}

/**
   向日葵色-订单模块定制-plain满足高亮
 */
 .el-button--diyxiangrikuiorder {
  color: #FFF;
  background-color: #fecc11;
  border-color: #fecc11;
}
.el-button--diyxiangrikuiorder:focus, .el-button--diyxiangrikuiorder:hover {
  background: #fecc00;
  border-color: #fecc00;
  color: #FFF;
}
.el-button--diyxiangrikuiorder.is-plain {
  color: #FFF;
  background-color: #fecc11;
  border-color: #fecc11;
}
.el-button--diyxiangrikuiorder.is-plain:focus, .el-button--diyxiangrikuiorder.is-plain:hover {
  background: #fecc11;
  border-color: #fecc11;
  color: #ffffff;
}
.el-button--diyxiangrikuiorder.is-disabled, .el-button--diyxiangrikuiorder.is-disabled:active, .el-button--diyxiangrikuiorder.is-disabled:focus, .el-button--diyxiangrikuiorder.is-disabled:hover {
  color: #FFF;
  /* background-color: #fadf7e;
  border-color: #fadf7e;   */
  background-color: #fecc11;
  border-color: #fecc11;
}

/**
   灰
 */
.el-button--diygrey {
  color: #FFF;
  background-color: #b5aa90;
  border-color: #b5aa90;
}
.el-button--diygrey:focus, .el-button--diygrey:hover {
  background: #b5aa80;
  border-color: #b5aa80;
  color: #FFF;
}
.el-button--diygrey.is-plain {
  color: #b5aa80;
  background-color: #fcedce;
  border-color: #b5aa80;
}
.el-button--diygrey.is-plain:focus, .el-button--diygrey.is-plain:hover {
  background: #b5aa90;
  border-color: #b5aa90;
  color: #ffffff;
}
.el-button--diygrey.is-disabled, .el-button--diygrey.is-disabled:active, .el-button--diygrey.is-disabled:focus, .el-button--diygrey.is-disabled:hover {
  color: #FFF;
  background-color: #b9b3a5;
  border-color: #b9b3a5;
}

.el-message {
  z-index: 99999 !important;
}

/**
   向日葵色
 */
.el-button--darkOrange {
  color: #FFF;
  background-color: #ee4e2e;
  border-color: #ee4e2e;
}
.el-button--darkOrange:focus, .el-button--darkOrange:hover {
  background: #ee4e0080;
  border-color: #ee4e0080;
  color: #FFF;
}
.el-button--darkOrange.is-plain {
  color: #fecc11;
  background-color: #fdf7e3cb;
  border-color: #fecc11;
}
.el-button--darkOrange.is-plain:focus, .el-button--darkOrange.is-plain:hover {
  background: #fecc11;
  border-color: #fecc11;
  color: #ffffff;
}
.el-button--darkOrange.is-disabled, .el-button--darkOrange.is-disabled:active, .el-button--darkOrange.is-disabled:focus, .el-button--darkOrange.is-disabled:hover {
  color: #FFF;
  background-color: #fadf7e;
  border-color: #fadf7e;
}

